<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="chrome=1">

    

    <title>
      http协议类 | 江月夜 
    </title>

    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    
      <meta name="author" content="江月夜">
    
    

    <meta name="description" content="http简介超文本传输协议（HTTP，HyperText Transfer Protocol)是互联网上应用最为广泛的一种网络协议，是一个客户端和服务器端请求和应答的标准（TCP）。通常，由HTTP客户端发起一个请求，建立一个到服务器指定端口（默认是80端口）的TCP连接。HTTP服务器则在那个端口监听客户端发送过来的">
<meta name="keywords" content="前端">
<meta property="og:type" content="article">
<meta property="og:title" content="http协议类 | 江月夜">
<meta property="og:url" content="http://yoursite.com/2018/09/25/http/index.html">
<meta property="og:site_name" content="江月夜">
<meta property="og:description" content="http简介超文本传输协议（HTTP，HyperText Transfer Protocol)是互联网上应用最为广泛的一种网络协议，是一个客户端和服务器端请求和应答的标准（TCP）。通常，由HTTP客户端发起一个请求，建立一个到服务器指定端口（默认是80端口）的TCP连接。HTTP服务器则在那个端口监听客户端发送过来的请求。一旦收到请求，服务器（向客户端）发回一个状态行，比如”HTTP/1.1 2">
<meta property="og:locale" content="zh-CN">
<meta property="og:image" content="http://yoursite.com/images/http-message.png">
<meta property="og:image" content="http://yoursite.com/images/http-request.png">
<meta property="og:updated_time" content="2018-10-29T09:06:29.629Z">
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="http协议类 | 江月夜">
<meta name="twitter:description" content="http简介超文本传输协议（HTTP，HyperText Transfer Protocol)是互联网上应用最为广泛的一种网络协议，是一个客户端和服务器端请求和应答的标准（TCP）。通常，由HTTP客户端发起一个请求，建立一个到服务器指定端口（默认是80端口）的TCP连接。HTTP服务器则在那个端口监听客户端发送过来的请求。一旦收到请求，服务器（向客户端）发回一个状态行，比如”HTTP/1.1 2">
<meta name="twitter:image" content="http://yoursite.com/images/http-message.png">
    
    
    
      <link rel="icon" type="image/x-icon" href="/favicon.png">
    
    <link rel="stylesheet" href="/css/uno.css">
    <link rel="stylesheet" href="/css/highlight.css">
    <link rel="stylesheet" href="/css/archive.css">
    <link rel="stylesheet" href="/css/china-social-icon.css">

</head>
<body>

    <span class="mobile btn-mobile-menu">
        <i class="icon icon-list btn-mobile-menu__icon"></i>
        <i class="icon icon-x-circle btn-mobile-close__icon hidden"></i>
    </span>

    

<header class="panel-cover panel-cover--collapsed">


  <div class="panel-main">

  
    <div class="panel-main__inner panel-inverted">
    <div class="panel-main__content">

        

        <h1 class="panel-cover__title panel-title"><a href="/" title="link to homepage">江月夜</a></h1>
        <hr class="panel-cover__divider" />

        
        <p class="panel-cover__description">
          腹有诗书气自华
        </p>
        <hr class="panel-cover__divider panel-cover__divider--secondary" />
        

        <div class="navigation-wrapper">

          <nav class="cover-navigation cover-navigation--primary">
            <ul class="navigation">

              
                
                <li class="navigation__item"><a href="/#blog" title="" class="blog-button">首页</a></li>
              
                
                <li class="navigation__item"><a href="/about" title="" class="">关于</a></li>
              
                
                <li class="navigation__item"><a href="/archive" title="" class="">归档</a></li>
              

            </ul>
          </nav>

          <!-- ----------------------------
To add a new social icon simply duplicate one of the list items from below
and change the class in the <i> tag to match the desired social network
and then add your link to the <a>. Here is a full list of social network
classes that you can use:

    icon-social-500px
    icon-social-behance
    icon-social-delicious
    icon-social-designer-news
    icon-social-deviant-art
    icon-social-digg
    icon-social-dribbble
    icon-social-facebook
    icon-social-flickr
    icon-social-forrst
    icon-social-foursquare
    icon-social-github
    icon-social-google-plus
    icon-social-hi5
    icon-social-instagram
    icon-social-lastfm
    icon-social-linkedin
    icon-social-medium
    icon-social-myspace
    icon-social-path
    icon-social-pinterest
    icon-social-rdio
    icon-social-reddit
    icon-social-skype
    icon-social-spotify
    icon-social-stack-overflow
    icon-social-steam
    icon-social-stumbleupon
    icon-social-treehouse
    icon-social-tumblr
    icon-social-twitter
    icon-social-vimeo
    icon-social-xbox
    icon-social-yelp
    icon-social-youtube
    icon-social-zerply
    icon-mail

-------------------------------->

<!-- add social info here -->



<nav class="cover-navigation navigation--social">
  <ul class="navigation">

    
      <!-- Github -->
      <li class="navigation__item">
        <a href="https://github.com/ajiu9" title="">
          <i class='icon icon-social-github'></i>
          <span class="label">GitHub</span>
        </a>
      </li>
    

    <!-- China social icon -->
    <!--
    
      <li class="navigation__item">
        <a href="" title="">
          <i class='icon cs-icon-douban'></i>
          <span class="label">Douban</span>
        </a>
      </li>

      <li class="navigation__item">
        <a href="" title="">
          <i class='icon cs-icon-weibo'></i>
          <span class="label">Weibo</span>
        </a>
      </li>

    -->



  </ul>
</nav>



        </div>

      </div>

    </div>

    <div class="panel-cover--overlay"></div>
  </div>
</header>

    <div class="content-wrapper">
        <div class="content-wrapper__inner entry">
            

<article class="post-container post-container--single">

  <header class="post-header">
    
    <h1 class="post-title">http协议类</h1>

    

    <div class="post-meta">
      <time datetime="2018-09-25" class="post-meta__date date">2018-09-25</time> 

      <span class="post-meta__tags tags">

          
            <font class="categories">
            &#8226; 分类:
            <a class="categories-link" href="/categories/http协议类/">http协议类</a>
            </font>
          

          
             &#8226; 标签:
            <font class="tags">
              <a class="tags-link" href="/tags/前端/">前端</a>
            </font>
          

      </span>
    </div>
    
    

  </header>

  <section id="post-content" class="article-content post">
    <h4 id="http简介"><a href="#http简介" class="headerlink" title="http简介"></a>http简介</h4><p>超文本传输协议（HTTP，HyperText Transfer Protocol)是互联网上应用最为广泛的一种网络协议，是一个客户端和服务器端请求和应答的标准（TCP）。<br>通常，由HTTP客户端发起一个请求，建立一个到服务器指定端口（默认是80端口）的TCP连接。HTTP服务器则在那个端口监听客户端发送过来的请求。一旦收到请求，服务器（向客户端）发回一个状态行，比如”HTTP/1.1 200 OK”，和（响应的）消息，消息的消息体可能是请求的文件、错误消息、或者其它一些信息。</p>
<h4 id="http协议的主要特点"><a href="#http协议的主要特点" class="headerlink" title="http协议的主要特点"></a>http协议的主要特点</h4><ul>
<li>简单快速 ：HTTP使用统一资源标识符（Uniform Resource Identifiers, URI）来传输数据和建立连接，URL是一种特殊类型的URI。访问某个资源只要输入URI即可。</li>
<li>灵活：每个http协议中。有一个头部分，有个数据类型，通过一个http协议的就可以完成不同数据类型的传输。</li>
<li>无连接：连接一次就会断开，不会保持连接。</li>
<li>无状态：客户端和服务端通信，客户端向服务端发送请求，http建立连接、传输结束后，连接断开，下次客户端再请求数据，服务端是无法区分上次连接和这次连接是否是同一身份，因为服务端没有记住你的状态，从http协议上是无法区分两次连接者的身份。</li>
</ul>
<h4 id="http报文的组成部分"><a href="#http报文的组成部分" class="headerlink" title="http报文的组成部分"></a>http报文的组成部分</h4><ul>
<li>请求报文：请求行、请求头、空行、请求体</li>
<li>响应报文：状态行、响应头、空行、响应体</li>
</ul>
<p><img src="/images/http-message.png" alt=""></p>
<h5 id="请求报文格式"><a href="#请求报文格式" class="headerlink" title="请求报文格式"></a>请求报文格式</h5><p><img src="/images/http-request.png" alt=""></p>
<h5 id="请求报文示例"><a href="#请求报文示例" class="headerlink" title="请求报文示例"></a>请求报文示例</h5><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br></pre></td><td class="code"><pre><span class="line">GET /build/music/ HTTP/1.1</span><br><span class="line">Host: www.ajiu9.com</span><br><span class="line">Connection: keep-alive</span><br><span class="line">Cache-Control: max-age=0</span><br><span class="line">Upgrade-Insecure-Requests: 1</span><br><span class="line">User-Agent: Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36</span><br><span class="line">Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8</span><br><span class="line">Accept-Encoding: gzip, deflate</span><br><span class="line">Accept-Language: zh-CN,zh;q=0.9</span><br><span class="line">If-None-Match: W/&quot;5ba9f717-234&quot;</span><br><span class="line">If-Modified-Since: Tue, 25 Sep 2018 08:51:35 GMT</span><br></pre></td></tr></table></figure>
<ul>
<li>第一部分：请求行，用来说明请求类型,要访问的资源以及所使用协议和版本。</li>
<li>第二部分：求头部，紧接着请求行（即第一行）之后的部分，用来说明服务器要使用的附加信息。</li>
<li>第三部分：空行，请求头部后面的空行是必须的。</li>
<li>第四部分：请求数据也叫主体，可以添加任意的其他数据（这个例子的请求数据为空）。</li>
</ul>
<h5 id="响应报文示例"><a href="#响应报文示例" class="headerlink" title="响应报文示例"></a>响应报文示例</h5><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br></pre></td><td class="code"><pre><span class="line">HTTP/1.1 304 Not Modified</span><br><span class="line">Date: Tue, 25 Sep 2018 08:53:14 GMT</span><br><span class="line">Via: 1.1 varnish</span><br><span class="line">Cache-Control: max-age=600</span><br><span class="line">ETag: W/&quot;5ba9f717-234&quot;</span><br><span class="line">Expires: Tue, 25 Sep 2018 09:03:04 GMT</span><br><span class="line">Age: 10</span><br><span class="line">Connection: keep-alive</span><br><span class="line">X-Served-By: cache-tyo19932-TYO</span><br><span class="line">X-Cache: HIT</span><br><span class="line">X-Cache-Hits: 1</span><br><span class="line">X-Timer: S1537865594.266742,VS0,VE0</span><br><span class="line">Vary: Accept-Encoding</span><br><span class="line">X-Fastly-Request-ID: d33e186dc5ff53c01d8128c32ff8a0f1092c9832</span><br></pre></td></tr></table></figure>
<ul>
<li>第一部分：状态行，由HTTP协议版本号， 状态码， 状态消息 三部分组成。</li>
<li>第二部分：消息报头，用来说明客户端要使用的一些附加信息</li>
<li>第三部分：空行，消息报头后面的空行是必须的。</li>
<li>第四部分：响应正文，服务器返回给客户端的文本信息。</li>
</ul>
<h4 id="http请求方法"><a href="#http请求方法" class="headerlink" title="http请求方法"></a>http请求方法</h4><ul>
<li>get ———— 获取资源</li>
<li>post ———— 传输资源</li>
<li>put ———— 更新资源</li>
<li>delete ———— 删除资源</li>
<li>head ———— 获得报文首部</li>
</ul>
<h4 id="get和post的区别"><a href="#get和post的区别" class="headerlink" title="get和post的区别"></a>get和post的区别</h4><ul>
<li><code>get在浏览器回退是无害的，而post会再次提交请求</code></li>
<li><code>get请求会被浏览器主动缓存，而post不会，除非手动设置</code></li>
<li><code>get请求参数会被完整保留在浏览器的历史记录里，而post中的参数不会被保留</code></li>
<li><code>get请求中传送的参数是有长度限制的（一般是2kb，不同浏览器不一样），post没有长度限制</code></li>
<li><code>get参数通过URL传递，post放在Request body中</code></li>
<li>get产生的URL地址可以被收藏，而get不可以</li>
<li>get请求只能进行url编码，而post支持多种编码方式</li>
<li>对参数的数据类型，get只接受ASCLL字符，而post没有限制</li>
<li>get比post更不安全，因为参数直接暴露在URL上，所以不能用来传递敏感信息</li>
</ul>
<h4 id="http状态码"><a href="#http状态码" class="headerlink" title="http状态码"></a>http状态码</h4><ul>
<li>1xx：指示信息 ——表示请求已接收，继续处理</li>
<li>2xx：成功——表示请求已被成功接收</li>
<li>3xx：重定向——要完成请求必须进行更进一步的操作</li>
<li>4xx：客户端错误——请求有语法错误或请求无法实现</li>
<li>5xx：服务端错误——服务器未能实现合法的请求</li>
<li>200 OK：客户端请求成功</li>
<li>206 Partial Content: 客户发送了一个带Range头的GET请求，服务器完成了它</li>
<li>301 Move Parmanently：所请求的页面已经转移到新的url</li>
<li>302 Found：所请求的页面已经临时转移至新的url</li>
<li>304 Not Modified：客户端有缓冲的文档并发出了一个条件性的请求，服务器告诉客户，原来缓冲的文档还可以继续使用</li>
<li>400 Bad Request：客户端请求有语法错误，不能被服务端所理解</li>
<li>401 Unauthorized：请求未经授权,这个状态代码必须和WWW-Authenticate报头域一起使用</li>
<li>403 Forboidden：对被请求页面的访问被禁止</li>
<li>404 NOt Found：请求资源不存在</li>
<li>500 Internal Server Error：服务器发送不可预期的错误原来缓冲文档还可以继续使用</li>
<li>503 Server Unavailable：请求未完成，服务器临时过载或当机，一段时间后可能恢复正常</li>
</ul>
<h4 id="持久连接"><a href="#持久连接" class="headerlink" title="持久连接"></a>持久连接</h4><p>HTTP协议采用“请求-应答”模式，当使用普通模式，即非Keep-Alive模式时，每个请求/应答客户和服务器都要新建一个连接，完成 之后立即断开连接（HTTP协议为无连接的协议）；<br>当使用Keep-Alive模式（又称持久连接、连接重用）时，Keep-Alive功能使客户端到服 务器端的连接持续有效，当出现对服务器的后继请求时，Keep-Alive功能避免了建立或者重新建立连接。</p>
<p>http 1.0中默认是关闭的，需要在http头加入”Connection: Keep-Alive”，才能启用Keep-Alive；<br>http 1.1中默认启用Keep-Alive，如果加入”Connection: close “，才关闭。</p>
<p>目前大部分浏览器都是用http1.1协议，也就是说默认都会发起Keep-Alive的连接请求了，所以是否能完成一个完整的Keep-Alive连接就看服务器设置情况。</p>
<h4 id="管线化"><a href="#管线化" class="headerlink" title="管线化"></a>管线化</h4><ul>
<li>1.在使用持久连接的情况下，某个连接上消息的传递类似于，请求一次响应一次并且不断开<br>请求1-&gt; 响应1-&gt;请求2-&gt;响应2-&gt;请求3-&gt;响应3</li>
<li>2.管线化通道是持久建立的，把所有请求打包一次传输，所有响应打包一次传输<br>请求1-&gt;请求2-&gt;请求3-&gt;响应1-&gt;响应2-&gt;响应3</li>
</ul>
<h4 id="管线化特点"><a href="#管线化特点" class="headerlink" title="管线化特点"></a>管线化特点</h4><ul>
<li>管线化机制通过持久连接完成，仅HTTP/1.1支持此技术</li>
<li>只有get和head请求可以进行管线化，而post则有所限制</li>
<li>初次创建连接是不应启动管线机制，因为对方(服务器)不一定支持HTTP/1.1版本的协议</li>
<li>管线化不会影响响应到来的顺序，如上面的例子所示，响应返还的顺序并未改变</li>
<li>HTTP/1.1要求服务器端支持管线化，但并不要求服务器端也对响应进行管线化处理，只是要求对于管线化的请求不失败即可</li>
<li>由于上面提到的服务器端问题，开启管线化很可能并不会带来大幅度的性能提升，而且很多服务器端和代理程序对管线化的支持并不好，因此现代浏览器如Chrome和Firefox默认并未开启管线化支持</li>
</ul>

  </section>

  <section class="post-comments">

   <!--PC和WAP自适应版-->
<div id="SOHUCS" sid="请将此处替换为配置SourceID的语句" ></div> 
<script type="text/javascript"> 
(function(){ 
var appid = 'cytl2q04G'; 
var conf = 'prod_c6e77c75d2d767714e129c11e500044d'; 
var width = window.innerWidth || document.documentElement.clientWidth; 
if (width < 960) { 
window.document.write('<script id="changyan_mobile_js" charset="utf-8" type="text/javascript" src="https://changyan.sohu.com/upload/mobile/wap-js/changyan_mobile.js?client_id=' + appid + '&conf=' + conf + '"><\/script>'); } else { var loadJs=function(d,a){var c=document.getElementsByTagName("head")[0]||document.head||document.documentElement;var b=document.createElement("script");b.setAttribute("type","text/javascript");b.setAttribute("charset","UTF-8");b.setAttribute("src",d);if(typeof a==="function"){if(window.attachEvent){b.onreadystatechange=function(){var e=b.readyState;if(e==="loaded"||e==="complete"){b.onreadystatechange=null;a()}}}else{b.onload=a}}c.appendChild(b)};loadJs("https://changyan.sohu.com/upload/changyan.js",function(){window.changyan.api.config({appid:appid,conf:conf})}); } })(); </script>
    
</section>


</article>


            <footer class="footer">

    <span class="footer__copyright">&copy; 2017 | 由<a href="https://hexo.io/">Hexo</a>| 主题<a href="https://github.com/someus/huno">Huno</a></span>
    
</footer>
        </div>
    </div>

    <!-- js files -->
    <script src="/js/jquery.min.js"></script>
    <script src="/js/main.js"></script>
    <script src="/js/scale.fix.js"></script>
    

    

    <script type="text/javascript" src="//cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
    <script type="text/javascript"> 
        $(document).ready(function(){
            MathJax.Hub.Config({ 
                tex2jax: {inlineMath: [['[latex]','[/latex]'], ['\\(','\\)']]} 
            });
        });
    </script>


    

    <script src="/js/awesome-toc.min.js"></script>
    <script>
        $(document).ready(function(){
            $.awesome_toc({
                overlay: true,
                contentId: "post-content",
            });
        });
    </script>


    
    
    <!--kill ie6 -->
<!--[if IE 6]>
  <script src="//letskillie6.googlecode.com/svn/trunk/2/zh_CN.js"></script>
<![endif]-->

</body>
</html>
